// Ext.BLANK_IMAGE_URL = '../ext/resources/images/default/s.gif';

Ext.onReady(function() {

	Ext.QuickTips.init();

	var xg = Ext.grid;
	// -----------Crea Plugins--------------//

	/*
	 * Crea las acciones a las cuales accesa cada fila
	 */
	var accion = new Ext.ux.grid.RowActions({
				header : 'Acciones',
				autoWidth : true,
				keepSelection : true,
				actions : [{
							iconCls : 'icon-edit-record',
							qtip : 'Editar Contrato'
						}, {
							iconCls : 'icon-actions',
							qtip : 'Ver Acciones'
						}, {
							iconCls : 'icon-error',
							qtip : 'Descuento por Contrato'
						}]
			});
	/*
	 * Crea la expansion para ver en detalle cada contrato
	 */
	var expander = new Ext.ux.grid.RowExpander({
		tpl : new Ext.Template(
				'--<br>',
				'<p><b>Cantidad Televisores:</b> {TcContrato-cantidad_televisores}</p>',
				'<b>Fecha Instalacion:</b> {TcContrato-fecha_instalacion:date("d-F-Y")}',
				'<p><b>Estado:</b> {TcEstadoContrato-descripcion}</p>',
				'<b>Colonia:</b> {MgColonia-descripcion}',
				'&nbsp &nbsp &nbsp &nbsp <b>Casa:</b> {TcContrato-casa}',
				'&nbsp &nbsp &nbsp &nbsp <b>Bloque:</b> {TcContrato-bloque}',
				'<p><b>Descripcion Direccion:</b> {TcContrato-descripcion_direccion}</p>',
				'<p><b>Comentarios:</b> {TcContrato-comentario}</p>--')
	});
	/*
	 * Plugin para la busqueda
	 */
	var busqueda = new Ext.ux.grid.Search({
				mode : 'remote',
				iconCls : true,
				dateFormat : 'm/d/Y',
				minLength : 1,
				width : 250,
				searchText : 'Buscar',
				searchTipText : 'Ingrese los datos a buscar y presione ENTER',
				selectAllText : 'Buscar Todos',
				shortcutKey : 'b',
				shortcutModifier : 'shift',
				disableIndexes : ['meses_deuda', 'TcContrato-id']
			})
	// FIN DE CREAR PLUGINS //

	/*
	 * Funcion que pone color a los meses en deuda dependiendo la situacion
	 */
	function mes_color(val) {
		if (val > 0) {
			return '<span style="color:red;">' + val + '</span>';
		} else if (val < 0) {
			return '<span style="color:green;">' + val + '</span>';
		}
		return val;
	}

	/*
	 * Trae los datos de la vista de cake agrupados por colonia
	 */
	var ds = new Ext.data.GroupingStore({
				sortInfo : {
					field : 'MgColonia-descripcion',
					direction : "ASC"
				},
				groupField : 'MgColonia-descripcion',
				proxy : new Ext.data.HttpProxy({
							url : "/cake/syscable/TcContratos/buscacontrato"
						}),
				reader : new Ext.data.JsonReader({
							id : 'TcContrato-id',
							root : 'contratos',
							totalProperty : 'total',
							fields : [{
										name : 'TcContrato-id'
									}, {
										name : 'TcContrato-contrato'
									}, {
										name : 'TcContrato-mg_cliente_id'
									}, {
										name : 'TcEstadoContrato-descripcion'
									}, {
										name : 'TcContrato-tc_tipo_contrato_id'
									}, {
										name : 'TcContrato-descripcion'
									}, {
										name : 'TcContrato-cantidad_televisores'
									}, {
										name : 'TcContrato-comentario'
									}, {
										name : 'TcContrato-fecha_instalacion',
										type : 'date',
										dateFormat : 'Y-m-d'
									}, {
										name : 'TcContrato-fecha_ultimo_pago',
										type : 'date',
										dateFormat : 'Y-m-d'
									}, {
										name : 'TcContrato-fecha_ultimo_pago_banco',
										type : 'date',
										dateFormat : 'Y-m-d'
									}, {
										name : 'TcContrato-telefono'
									}, {
										name : 'MgColonia-descripcion'
									}, {
										name : 'TcContrato-casa'
									}, {
										name : 'TcContrato-bloque'
									}, {
										name : 'TcContrato-calle'
									}, {
										name : 'meses_deuda'
									}, {
										name : 'TcContrato-descripcion_direccion'
									}]
						}),
				sm : new Ext.grid.RowSelectionModel({
							singleSelect : true,
							listeners : {
								load : {
									scope : xg,
									fn : function() {
										xg.getSelectionModel().selectFirstRow();
									}
								}
							}
						})
			});
	/*
	 * Crea la tabla utilizando los parametros definidos anteriormente
	 */
	var gridclientes = new xg.GridPanel({
		ds : ds,
		cm : new xg.ColumnModel({
					defaults : {
						width : 80,
						sortable : true
					},
					columns : [expander, {
								header : "ID",
								dataIndex : 'TcContrato-id',
								hidden : true
							}, {
								header : "No. Contrato",
								dataIndex : 'TcContrato-contrato',
								width : 80,
								hidden : false
							}, {
								header : "Codigo Cliente",
								dataIndex : 'TcContrato-mg_cliente_id',
								width : 65
							}, {
								header : "Descripcion",
								dataIndex : 'TcContrato-descripcion',
								width : 170
							}, {
								header : "Meses Deuda",
								dataIndex : 'meses_deuda',
								renderer : mes_color,
								width : 55
							}, {
								header : "Colonia",
								dataIndex : 'MgColonia-descripcion'
							}, {
								header : "Fecha Ultimo Pago",
								dataIndex : 'TcContrato-fecha_ultimo_pago_banco',
								renderer : Ext.util.Format
										.dateRenderer('d-F-Y'),
								hidden : false
							}, {
								header : "Ultimo Mes Pago",
								dataIndex : 'TcContrato-fecha_ultimo_pago',
								renderer : Ext.util.Format.dateRenderer('F-Y'),
								hidden : false
							}, {
								header : "Telefono",
								dataIndex : 'TcContrato-telefono',
								hidden : false
							}, accion

					]
				}),
		stripeRows : true,
		view : new Ext.grid.GroupingView({
			forceFit : true,
			groupTextTpl : '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Elementos" : "Elemento"]})'
		}),
		columnLines : true,
		width : 850,
		height : 400,
		frame : true,
		bbar : new Ext.PagingToolbar({
					pageSize : 10,
					store : ds,
					displayInfo : true,
					displayMsg : 'Mostrando contratos del {0} - {1} de {2}',
					emptyMsg : 'No hay contratos que mostrar'
				}),

		plugins : [expander, accion, busqueda],
		title : 'Contratos Conectados',
		iconCls : 'icon-grid'
		,
			// renderTo: 'grid-paging'
	});
	ds.load({
				params : {
					limit : 10,
					start : 0
				}
			});
	/*
	 * Determina que accion va a realizar cada icono
	 */
	accion.on({
				action : function(grid, record, action, row, col) {
					switch (action) {
						case 'icon-edit-record' :
							location.href = "../TcContratos/edit/"
									+ record.get('TcContrato-id');
							break;
						case 'icon-open' :
							location.href = "../TcContratos/view/"
									+ record.get('TcContrato-id');
							break;
						case 'icon-error' :
							location.href = "../MgDescuentos/mostrar/"
									+ record.get('TcContrato-id');
							break;
						case 'icon-actions' :
							location.href = "../TcAcciones/mostrar/"
									+ record.get('TcContrato-id');
							break;
						break;
				}
				}
			});
});